<template>
    <view class="form-wrap">
        <u-form :model="formData" ref="uForm" :border-bottom="false" :label-width="180" label-align="right">
            <u-form-item label="图纸名称：" prop="time" :border-bottom="false">
                <FormItemText v-model="formData.name" class="form-wrap_item" :detail="detail" />
            </u-form-item>
            <u-form-item label="制图单位：" prop="time" :border-bottom="false">
                <FormItemText v-model="formData.planOrg" class="form-wrap_item" :detail="detail" />
            </u-form-item>
            <u-form-item label="制图人：" prop="time" :border-bottom="false">
                <FormItemText v-model="formData.planPerson" class="form-wrap_item" :detail="detail" />
            </u-form-item>
            <u-form-item label="制图时间：" prop="time" :border-bottom="false">
                <FormItemDateTime v-model="formData.time" class="form-wrap_item" placeholder="请选择 制图时间" :detail="detail" />
            </u-form-item>
            <u-form-item label="起火单位：" prop="time" :border-bottom="false">
                <FormItemText v-model="formData.fireOrg" class="form-wrap_item" :detail="detail" />
            </u-form-item>
            <u-form-item label="起火时间：" prop="time" :border-bottom="false">
                <FormItemDateTime v-model="formData.fireTime" class="form-wrap_item" placeholder="请选择 起火时间"
                    :detail="detail" />
            </u-form-item>
            <u-form-item label="起火地址：" prop="time" :border-bottom="false">
                <FormItemText v-model="formData.address" class="form-wrap_item" :detail="detail" />
            </u-form-item>
            <u-form-item label="审图人：" prop="time" :border-bottom="false">
                <FormItemText v-model="formData.applyPlanPerson" class="form-wrap_item" :detail="detail" />
            </u-form-item>
            <u-form-item label="录音：" prop="studioUrlList" :border-bottom="false">
                <FileChoose :value="videoList2" :config="fileChooseConfig" @on-upload="handleOnUpload"
                    @on-remove="handleOnRemove" :detail="detail" />
            </u-form-item>
        </u-form>
    </view>
</template>

<script>
import FormItemText from '@/pagesH5/components/Form/formItemText.vue'
import FormItemDateTime from '@/pagesH5/components/Form/formItemDateTime.vue'
import FileChoose from '@/uni_modules/file-choose/components/file-choose/file-choose.vue'
export default {
    components: { FormItemText, FormItemDateTime, FileChoose },
    model: {
        prop: 'value',
        event: 'change'
    },
    props: {
        value: {
            type: Object,
            default: () => ({})
        },
        detail: {
            type: Boolean,
            default: false
        }
    },
    data() {
        return {
            videoList: [],
            fileChooseConfig: {
                size: 20,
                limit: 99,
                title: "",
                headers: this.headers,
                formData: {},
                automatic: false,
                fileMediatype: 'file',
                mediaTypeFileType: 'mp3,wav,m4a,amr,flac'
            }
        }
    },
    computed: {
        formData: {
            get() {
                return this.value
            },
            set(val) {
                this.$emit('change', val)
            }
        },
        videoList2: {
            get() {
				console.log(this.formData);
				const studioUrlList = this.formData.studio ? JSON.parse(this.formData.studio) : []
				console.log(studioUrlList);
                const list = studioUrlList.map(url => {
                    let fileName = url.match(/\/([^/]+)$/)[1];
                    return {
                        url: url,
                        type: 'audio',
                        name: fileName
                    }
                })
                return list || []
            },
            set(val) {
				console.log(val);
                this.$emit('change', {
                    ...this.formData,
                    studio: JSON.stringify(val)
                })
            }
        }
    },
    methods: {
        handleOnUpload(file) {
            let list = this.videoList2;
            list.push(file.url)
            this.videoList2 = list
        },
        handleOnRemove(fileList, index) {
            let newFileList = fileList
            this.videoList2 = [...newFileList]
        },
    }
}
</script>